<!DOCTYPE html>
<html><!--HTML5 doctype-->
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="Pragma" content="no-cache">
<script src="intelxdk.js"></script>
<!-- phantom library, needed for XDK api calls -->
<script src="cordova.js"></script>
<!-- phantom library, needed for Cordova api calls -->
<script src="xhr.js"></script>
<!-- phantom library, needed for XDK CORS -->
<script type="text/javascript" language="javascript">
    var onDeviceReady = function () {                 // called when Cordova is ready
      if (window.Cordova && navigator.splashscreen) { // Cordova API detected
        navigator.splashscreen.hide();                // hide splash screen
      }
      setTimeout(function () {
        $.ui.launch();
      }, 50);
    };
    document.addEventListener("deviceready", onDeviceReady, false);
</script>
<script src="js/jquery.min.js"></script>
<script src="js/af.ui.jquery.min.js"></script>
<script src="js/af.scroller.js"></script>
<script src="js/ap.slidemenu.js"></script>
<script src="js/af.scroller.js"></script>
<script src="js/af.actionsheet.js"></script>
<script src="js/jquery.loadJSON.js"></script>
<script src="js/jquery.form.js"></script>
<!--<style class="noload" data-s="https://maps.googleapis.com/maps/api/js?sensor=true"></style>-->
<!--<style class="noload" data-s="js/af.maps.js"></style>-->
<script src="js/custom.js"></script>
<script>
    //if (isIntel)
    //  $.ui.autoLaunch = false;
    $.ui.useOSThemes = false; //Change this to false to force a device theme
    $.ui.blockPageScroll();
    $.ui.launch();
    $(document).ready(function () {
        $.ui.setSideMenuWidth('260px');
        //$.ui.removeFooterMenu();
        if ($.ui.useOSThemes && (!$.os.ios || $.os.ios7))
            $("#afui").removeClass("ios");
        if(localStorage.getItem('access_token')) {
            //alert('there is token:'+localStorage.getItem('access_token'));
            //get_latest_jobs();
            /*$("#maps").gmaps({zoom: 5,center: new google.maps.LatLng(40.010787, -76.278076),mapTypeId: google.maps.MapTypeId.ROADMAP});*/
            //$(document).on("loadpanel","#latest", setupLatest);
            //$(document).on("loadpanel","#highlight", setupHighlight);
            $(document).on("loadpanel","#personal", setupPersonal);
            //$(document).on("loadpanel","#cv", setupCV);
            $(document).on("loadpanel","#education_detail", setupEducation);
            $(document).on("loadpanel","#experience_detail", setupExperience);
        } else {
            //alert('there is no token');
            setTimeout(function () {
                $.ui.loadContent("#select",false,false,"up");
            }, 500);
        }
        $(function() {
            var $form = $('#image_form'),
            $result = $('#result');

            $('form').delegate('#image_file', 'change', function() {
                $result.ajaxStart(function() {
                    $(this).text('Loading....');
                });
                $form.ajaxForm({
                    //target: $result,
                    success: updatePic
                }).submit();
            });
        });
    });
    
    function updatePic(data) {
        var jsonObject = JSON.parse(data);
        $('#profilePic').attr("src",jsonObject.full_path);
        var userObject = JSON.parse(localStorage.getItem('user'));
        userObject.avatar = jsonObject.full_path;
        localStorage.setItem('user', JSON.stringify(userObject));
    }
</script>
<link href="css/icons.css" rel="stylesheet" type="text/css">
<link href="css/icons.fa.css" rel="stylesheet" type="text/css">
<link href="css/af.ui2.css" rel="stylesheet" type="text/css">
<link href="css/af.actionsheet.css" rel="stylesheet" type="text/css">
<!--<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css">-->
<link href="css/custom.css" rel="stylesheet" type="text/css">
<style>
    body, #afui {background-color:#000}  
    #afui #settingsList.list li {padding: 10px} 
    #map {position:absolute;top:0;bottom:-10px;left:-10px;right:-10px}
</style>
</head>
<body>
<div id="afui" class="ios7">
    <nav id="nav_0">
        <ul class="list">
            <li><a href="#latest" class="icon home">Jobs</a>
            </li>
            <li><a href="#cv" class="icon paper">CV</a>
            </li>
            <li><a href="#application" class="icon paper">Application</a>
            </li>
            <li><a href="#" onclick="logout();" class="icon fa-power-off">Logout</a>
            </li>
        </ul>
    </nav>
    <div id="header" class="header"></div>
    <div id="content" style="">
        <div class="panel" title="Latest" id="latest" selected="selected" style="" data-appbuilder-object="page" data-load="setupLatest" data-footer="footer_2" data-nav="nav_0">
            <header data-appbuilder-object="header" class="" style="">
                <a id="menubadge" onclick="$.ui.toggleSideMenu()" class="menuButton" style="float:left !important"></a>
                <h1>Latest</h1>
            </header>
            <ul class="list" id="latestJobList" data-appbuilder-object="list">
            </ul>
            <div id="infiniteLatest"></div>
        </div>
        <div class="panel" title="Highlight" data-nav="nav_0" data-footer="footer_2" id="highlight"
        style="" data-load="setupHighlight" data-appbuilder-object="page">
            <header data-appbuilder-object="header" class="" style="">
                <a id="menubadge" onclick="$.ui.toggleSideMenu()" class="menuButton" style="float:left !important"></a>
                <h1>Highlight</h1>
            </header>
            <ul class="list" id="highlightJobList" data-appbuilder-object="list">
            </ul>
            <div id="infiniteHighlight"></div>
        </div>
        <div class="panel" title="Job Detail" data-nav="nav_0" data-footer="none" id="jobDetail" style="" data-appbuilder-object="page">
        </div>
        <div class="panel" title="Login" data-nav="nav_0" data-footer="none" id="login"
        style="" data-appbuilder-object="page">

            <div class="container" style="width: 100%; height: 100%;" data-appbuilder-object="container">
                <div class="input_element form_element" style="width:100%;overflow:hidden;padding-top:10px;"
                data-appbuilder-object="input">
                    <input type="text" style="float:left;" id="email" placeholder="Email">
                </div>
                <div class="input_element form_element" style="width:100%;overflow:hidden" data-appbuilder-object="input">
                    <input type="password" style="float:left;" id="password" placeholder="Password">
                </div><a class="button" href="#" style="width: 100%;" data-appbuilder-object="button"
                data-transition="slide" onclick="login();">Login</a>
                <div class="input_element form_element" style="width:100%;overflow:hidden;padding-top:10px;"
                data-appbuilder-object="input" id="errorMessage">
                </div>
            </div>
        </div>
        <div class="panel" title="Select" id="select" data-appbuilder-object="page" style="">
            <div class="container" style="width: 100%; height: 100%;" data-appbuilder-object="container">
                <div class="input_element form_element" style="width:100%;overflow:hidden" data-appbuilder-object="input">
                    <a class="button" href="#" style="width: 100%;" data-appbuilder-object="button"
                    data-transition="slide" id="signUp">Sign Up</a>
                </div>
                <div class="input_element form_element" style="width:100%;overflow:hidden" data-appbuilder-object="input"><a class="button" href="#login" style="width: 100%;" data-appbuilder-object="button"
                    data-transition="slide" id="login">Login</a>
                </div>
            </div>
        </div>
        <div class="panel" title="CV" id="cv" style="" data-appbuilder-object="page" data-nav="nav_0"
        data-load="setupCV" data-footer="none">
            <header style="" data-appbuilder-object="header" class="">
                <a id="menubadge" onclick="$.ui.toggleSideMenu()" class="menuButton" style="float:left !important"></a>
                <h1>CV</h1>
            </header>
            <div class="container" style="width: 100%;" data-appbuilder-object="container">

                <img src="images/blank.gif" id="profilePic" style="width: auto; height: 100px; padding: 5px;"
                alt="Title" data-appbuilder-object="image" class="center-image"
                onclick="uploadFromGallery();">
                <form action="http://192.168.10.24/wnsgbl-repo/mobileapp/profile_pic" id="image_form"
                method="post" enctype="multipart/form-data">
                    <input name="image_file" id="image_file" type="file" hidden="true">
                    <input type="hidden" name="userID">
                </form>
                <div id="result"></div>
                <a id="menubadge" onclick="openPersonal();" class="icon fa-edit big" style="float:right"></a>
                <div class="text_item" data-appbuilder-object="text" style="text-align: center; padding: 5px;">Cahyo Nugroho</div>
            </div>
            <div style="width: 100%;padding-top:10px;padding-bottom:10px;">
                <h3>Education</h3>
                <!--<a id="menubadge" href="#education" class="icon fa-edit" style="float:right"></a>-->
                <ul class="list" id="educationList" data-appbuilder-object="list">
                </ul>
                <a id="eduAdd" onclick="openEducationDetail(null);" class="button" style="width: 100%;"
                data-appbuilder-object="button"><i class="icon fa-plus"></i> Add Education</a>
            </div>
            <div style="width: 100%;padding-bottom:10px;">
                <h3>Experience</h3>
                <ul class="list" id="experienceList" data-appbuilder-object="list">
                </ul>
                <a id="experienceAdd" onclick="openExperienceDetail(null);" class="button" style="width: 100%;"
                data-appbuilder-object="button"><i class="icon fa-plus"></i> Add Experience</a>
            </div>
            <div style="width: 100%;padding-bottom:10px;">
                <h3>Knowledge</h3>
                <ul class="list" id="knowledgeList" data-appbuilder-object="list">
                </ul>
                <a id="knowledgeAdd" onclick="openKnowledgeDetail(null);" class="button" style="width: 100%;"
                data-appbuilder-object="button"><i class="icon fa-plus"></i> Add Knowledge</a>
            </div>
        </div>
        <div class="panel" title="Personal" data-nav="nav_0" id="personal" data-appbuilder-object="page"
        data-footer="none" style="width: 100%; height: 100%;" data-defer="personal.html">

        </div>

        <div class="panel" title="Education" data-nav="nav_0" id="education_detail" data-appbuilder-object="page"
        data-footer="none" style="width: 100%; height: 100%;" data-defer="education.html">

        </div>

        <div class="panel" title="Experience" data-nav="nav_0" id="experience_detail" data-appbuilder-object="page"
        data-footer="none" style="width: 100%; height: 100%;" data-defer="experience.html">

        </div>

        <div class="panel" title="Knowledge" data-nav="nav_0" id="knowledge_detail" data-appbuilder-object="page"
        data-footer="none" style="width: 100%; height: 100%;" data-defer="knowledge.html">

        </div>

        <div class="panel" title="Apply" data-nav="nav_0" id="apply_job" data-appbuilder-object="page"
        data-footer="none" style="width: 100%; height: 100%;" data-defer="apply.html">

        </div>

        <div class="panel" title="Applications" id="application" style="" data-appbuilder-object="page"
        data-footer="none" data-nav="nav_0">
            <header data-appbuilder-object="header" class="" style="">
                <a id="menubadge" onclick="$.ui.toggleSideMenu()" class="menuButton" style="float:left !important"></a>
                <h1>Application</h1>
            </header>
            <ul class="list" id="applicationList" data-appbuilder-object="list">
            </ul>
        </div>
    </div>
    <div id="navbar" class="footer"> <a class="icon home" style="">Home</a>
    </div>
    <footer id="footer_2" data-appbuilder-object="footer"><a href="#latest" class="icon home">Latest</a><a href="#highlight" class="icon stack">Highlight</a>
    </footer>
</div>
</body>





</html>